<template>
	<view class="scence-guide">
		<!-- #ifdef H5 -->
		<Header @back="back" left-icon="back" left-text="" right-text="" title="景区指南"></Header>
		<!-- #endif -->
		<view class="content">
			<view class="title">
				<text>实用信息</text>
			</view>
			<view class="guide-tab">
					<view class="time">
						<view class="left-time">
							<text>开放时间：</text>
						</view>
						<view class="right-time">
							<text>{{getDetails.datamark}}</text>
						</view>
					</view>
					<view class="ticket">
						<view class="left-ticket">
							<text>游玩项目：</text>
						</view>
						<view class="right-ticket">
							<text>{{getDetails.project}} </text>
						</view>
					</view>
					<view class="tips">
						<view class="left-tips">
							<text >交通信息：</text>	
						</view>
						<view class="right-tips">
							<text>{{getDetails.traffic}} </text>
						</view>
					</view>	
					<view class="bus">
						<view class="left-bus">
							<text>免票政策：</text>
						</view>
						<view class="right-bus">
							<text>{{getDetails.ticketRaiders}} </text>
						</view>
					</view>	
			</view>
		</view>
		<view class="project" v-if="getDetails.traveltips">
			<view class="project-title">
				<text>入园须知</text>
			</view>
			<view class="project-info">
				<text>{{getDetails.traveltips}}</text>
			</view>
		</view>
		<view class="project">
			<view class="project-title">
				<text>安全须知</text>
			</view>
			<view class="project-info">
				<text>{{getDetails.notice}}</text>
			</view>
		</view>
	</view>
</template>

<script>
	import Header from '../../../components/header.vue';
	export default {
		data() {
			return {
				getDetails:[]
			};
		},
		components: {
			Header
		},
		onLoad: function(option) {
			console.log("传过来的参数---------->",JSON.parse(decodeURIComponent(option.item)));
			this.getDetails = JSON.parse(decodeURIComponent(option.item));
		},
		methods:{
			back() {
				uni.navigateBack({
					delta: 1
				});
			},
		}
		
	}
</script>

<style lang="scss" scoped>
		.scence-guide{
			background: #f5f5f5;
			// height: 100%;
		}
		.content{
			padding: 10upx;
			background: #fff;
			/* #ifdef H5 */
			padding-top:100upx;
			/* #endif */
			.title{
				margin: 35upx 0 0 30upx;
				font-weight: bold;
				font-size: 32upx;
			}
			.guide-tab{
			// height: 360upx;
			background: #fff;
			// box-shadow: 2px 2px 2px #ddd;
			// border-radius: 16upx;
			// display: flex;
			font-size: 26upx;
			// flex-direction: column;
			// flex-wrap: nowrap;
			// justify-content: flex-start;
			padding: 32upx;
			.time,.ticket,.tips,.bus{
				// padding: 32upx;
				display: flex;
				flex-direction: row;
				justify-content: flex-start;
				// width: 100%;
				.left-time,.left-ticket,.left-tips,.left-bus{
					width: 25%;
					line-height: 50upx;
				}
				.right-time,.right-ticket,.right-tips,.right-bus{
					width: 80%;
					// display: flex;
					line-height: 50upx;
					// justify-content: center;
					// justify-content: flex-end;
					padding-right: 0;
					// flex-direction: column;
					
					// align-items: center;
				}
			}
			
			
		}
	}
	.project{
		background: #fff;
		// height: 300upx;
		margin: 10upx 0 10upx 0;
		padding: 50upx;
		.project-title{
				// margin: 35upx 0 0 30upx;
				font-weight: bold;
				font-size: 32upx;
			}
		.project-info{
				margin-top: 10upx;
				font-size: 26upx;
				line-height: 50upx;
		}
	}
		
</style>
